// import DatePicker from '@src/components/datePicker';
import { ranges } from '@src/utils';
import { Form, Row, Col, Input, Select, Button, Space, DatePicker } from 'antd';
import qs from 'qs';
import { useEffect, useState } from 'react';
interface ServicerNamesProps {
  code: string;
  name: string;
}
export const CompensateManageSearchForm = ({ searchBtnF }: any) => {
  const [form] = Form.useForm();
  const { Option } = Select;
  const [resetButtonDisabled, setResetButtonDisabled] = useState<boolean>(true);
  const onReset = () => {
    form.resetFields();
    setResetButtonDisabled(true);
  };
  const onFinish = async (values: any) => {
    searchBtnF(values);
  };
  const onValuesChange = () => {
    setResetButtonDisabled(!qs.stringify(form.getFieldsValue()));
  };
  return (
    <Form
      className="anTopSearchForm fff pad20"
      form={form}
      layout="inline"
      name="maitainSearcher"
      onFinish={onFinish}
      onValuesChange={onValuesChange}
    >
      <Form.Item label="数据类型" name="type" rules={[{ required: true }]}>
        <Select allowClear placeholder="请选择">
          <Option value="0">保单</Option>
          <Option value="1">批单</Option>
        </Select>
      </Form.Item>
      <Form.Item label="批号" name="businessNo">
        <Input placeholder="请输入" />
      </Form.Item>
      <Form.Item label="聚合日期" name="dates">
        <DatePicker.RangePicker ranges={ranges} />
      </Form.Item>
      <div className="searchBtnBox">
        <div>
          <Button className="marg020" disabled={resetButtonDisabled} onClick={onReset}>
            重置
          </Button>
          <Button type={'primary'} htmlType="submit">
            搜索
          </Button>
        </div>
      </div>
    </Form>
  );
};
